<template>
  <div class="ivu-table ivu-table-default ivu-table-border">
    <table class="ivu-table-body" width="100%">
      <thead>
        <th style="text-align: center">问题</th>
        <th style="text-align: center">选项</th>
      </thead>
      <tbody class="ivu-table-tbody">
        <tr class="ivu-table-row" v-for="(item, index) in qaList" :key="index">
          <td
            v-if="item.show"
            class="ivu-table-column-center"
            :rowspan="item.rowspan"
          >
            <div class="ivu-table-cell">
              {{ item.title }}
            </div>
          </td>
          <td class="ivu-table-column-center">
            <div class="ivu-table-cell">
              {{ item.answer }}
            </div>
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</template>

<script>
export default {
  name: "MergeTable",
  props: {
    /**
     * 问题列表
     */
    qaList: {
      type: Array,
      required: true,
      default() {
        return [];
      },
    },
  }
};
</script>